<template>
    <!-- <left-cate></left-cate> -->
    <div>
        <if-header></if-header>
        <van-search
            v-model="value"
            shape="round"
            background="#fff"
            placeholder="请输入食物名称"
            />
        <div class="box">
            <van-sidebar v-model="activeKey" class="leftCate">
                
                <!-- <van-sidebar-item :title="item.title" v-for="(item, index) in goodsList" :key="index" :to="'/ifCanEat/'+item.etype+'/'+item.cid" class="leftItem" @click.native="itemClick($event)" :etype="item.etype"> -->
                <van-sidebar-item :title="item.title" v-for="(item, index) in goodsList" :key="index" :to="'/ifCanEat/'+item.cid" class="leftItem" @click="itemClick(item.etype,item.cid)" >
                </van-sidebar-item>
            </van-sidebar>
            <router-view :itemList="itemList"></router-view>
        </div>
    </div>
</template>

<script>
import Vue from 'vue';
import ifHeader from './header'
import { Search } from 'vant';
import rightCatec from './rightCate'
import { Sidebar, SidebarItem, Notify } from 'vant';

Vue.use(Search);
Vue.use(Sidebar);
Vue.use(SidebarItem);
Vue.use(Notify);
export default {
    data() {
        return {
        activeKey: 0,
        goodsList:[],
        itemList:[],
        etype:'',
        value : ''
        };
    },
    components: {
        'if-header' : ifHeader,
    },
     methods: {
        onChange(index) {
        Notify({ type: 'primary', message: index });
        },
        getdata(data) {
            this.itemList = data;
        },
        itemClick(etype,cid) {
            this.$http.post({
                url:'/content/Tools/Eat.html',
                params:{
                    do: "Index",
                    cid: cid,
                    etype: etype,
                    pet_type: "dog",
                    foreign_type: 1,
                    isWeb: 1,
                    system: "wap",
                    version: 517,
                    distinct_id:"1768548a12f68-06d1a541b973ac-c791039-1327104-1768548a1313ca",
                    sessionToken: '',
                    wx_site: '',
                    debug_param: '',
                }
            }).then(res=>{
                this.itemList = res.data.rightCate
                console.log(this.itemList);
                console.log(this.itemList);
                
            })
        },
    },

    async mounted() {
        let result1 = await this.$http.post({
            url:'/content/Tools/Eat.html',
            params:{
                do: "Index",
                cid: 1,
                etype: 1,
                pet_type: "dog",
                foreign_type: 1,
                isWeb: 1,
                system: "wap",
                version: 517,
                distinct_id:"1768548a12f68-06d1a541b973ac-c791039-1327104-1768548a1313ca",
                sessionToken: '',
                wx_site: '',
                debug_param: '',
            }
        })
        this.goodsList = result1.data.leftCate
        this.itemList = result1.data.rightCate
    }
}
</script>

<style lang="stylus" scoped>
    .box
        display flex
    .van-sidebar-item--select::before
        background-color #fff
    .leftCate
        height 5.55rem
        overflow-y scroll
        .leftItem
            height .45rem
            width .9rem
            font-size .13rem
            text-align center
            padding-left 0
            padding-right 0
    
</style>